<template>
	<!--学生考试页面 -->
	<page-body>
		<view class="page">
			<view class="flex benben-position-layout flex flex-wrap align-center mance_flex_0"
				:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
				<view class='flex flex-wrap align-center justify-between flex-sub mance_fd0_0'>
					<view class='flex flex-wrap align-center mance_fd0_0_c0'>
						<text class='fu-iconfont2  mance_fd0_0_c0_c0' @tap.stop="handleJumpDiy" data-type="back"
							data-url="1">&#xE794;</text>
					</view>
					<view class='flex flex-wrap align-stretch justify-center'>
						<text class='mance_fd0_0_c1_c0 hid1'>{{testName}}</text>
					</view>
					<view @tap.stop="modalShow2=true" style="font-size: 32rpx;color: #333333;"
						class='flex flex-wrap align-center justify-end mance_fd0_0_c0'>
						退出
					</view>
				</view>
			</view>

			<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>

			<view class="overview">
				<view class="time">
					<image style="width: 40rpx;height: 40rpx;margin-right: 20rpx; " src="/static/exam/time.png" mode="">
					</image>{{timeDisplay }}
				</view>

				<view class="subject">
					<view class="type">
						<view class="name">
							<view class="line">
							</view>
							{{getTypeName(examObj.type)}}
						</view>
						<view class="number">
							<span>{{examIndex + 1}} </span>/{{list.length}}
						</view>
					</view>
					<view class="title" v-html="examObj.title">
						<!-- {{examObj.title}} -->
					</view>

					<!-- 选择 1单选 2多选 3判断 -->
					<view v-if="[1,2,3].includes(+examObj.type) " class="changeBox">
						<!-- change-item-active -->
						<view class="change-item"
							:class="examObj.answer.includes(item.label) ? 'change-item-active' : ''"
							@click="selectChange(examObj.type,item.label)" v-for="item in examObj.options"
							:key="item.label">
							<text class="index">
								{{item.label}}
							</text>
							<view class="content" v-html="item.value">
								<!-- {{item.value }} -->
							</view>
						</view>

					</view>

					<!-- 4简答  5填空 -->
					<view v-if="[5].includes(+examObj.type)" class="short-answer">
						<u--textarea class="answer" v-model="examObj.answer" :autoHeight="true" :maxlength="-1"
							placeholder="请在此作答" />
					</view>
					<view v-if="[4].includes(+examObj.type)" class="jdt">
						<benben-editor class='ticketnotice_fd1_0_icch' v-model="fwbbody" :read-only='false'
							:hidden-icons='[]' placeholder='开始输入...' :icon-height='48' :font-size='32' :editor-height='500'>
						</benben-editor>
					</view>
					<!-- 6开放 -->
					<view v-if="[6].includes(+examObj.type)" class="short-answer">
					<view class='flex flex-direction align-stretch cs_fd1_0_c3_c0_ibhf'>
					
						<benben-files-upload :file-list.sync="fileLists" class="flex flex-direction align-stretch flex cs_fd1_0_c3_c0_c1_ibhf" ref="benbenFilesUploadfd1_0_c3_c0_c1" :is-show-clean='true' :maxlength="10">
						    <template v-slot="{ fileList }">
						        <view class="flex-direction align-stretch cs_flex_list_fd1_0_c3_c0_c1_ibhf">
									<view class='flex align-center cs_fd1_0_c3_c0_c0_ibhf' v-for="(flie, index) in fileList" :key="index">
										<image class='cs_fd1_0_c3_c0_c0_c0_ibhf' mode="aspectFit" :src='STATIC_URL+"stcimg/01.png"'></image>
										<text @tap.stop="$refs.benbenFilesUploadfd1_0_c3_c0_c1.previewFile(index)">{{ flie.name }}</text>
										<image class='cs_fd1_0_c3_c0_c0_c2_ibhf' mode="aspectFit" @tap.stop="$refs.benbenFilesUploadfd1_0_c3_c0_c1.delFile(index)" :src='STATIC_URL+"stcimg/6.png"'></image>
									</view>
						        </view>
						        <button class='cs_fd1_0_c3_c0_c11_ibhf' @tap.stop="$refs.benbenFilesUploadfd1_0_c3_c0_c1.manyChooseFiles()">上传文件</button>
						    </template>
						</benben-files-upload>
						<view class='flex flex-wrap align-center'>
							<text class='cs_fd1_0_c3_c0_c1_c0_ibhf'>*</text>
							<text class='cs_fd1_0_c3_c0_c1_c1_ibhf'>附件上传仅支持文档、视频、音频、图片</text>
						</view>
					</view>
					</view>
				</view>



			</view>

			<!-- 答题卡 -->
			<u-popup custom-style="border-top-left-radius: 24rpx; border-top-right-radius: 24rpx;"
				:show="answerSheetShow" mode="bottom">
				<view class="answer-sheet">
					<view class="title">
						答题卡 <image @tap.stop="answerSheetShow = false"
							style="width: 24rpx; height: 24rpx;float: right;margin-top: 44rpx;"
							src="@/static/exam/close.png" mode=""></image>
					</view>

					<view class="answer-content">
						<view class="">
							<!-- <div class="type"> 5/4</div> -->
							<div class="content">
								<div class="content-ite"
									:class="(item.answer && item.answer.length) ? 'content-ite-other' : '' "
									v-for="(item,index) in list">
									{{index + 1}}
								</div>
							</div>
						</view>

					</view>
				</view>
			</u-popup>

			<!-- 提示框 -->
			<u-modal @cancel="modalShow=false" @confirm="submit()" :show="modalShow" :showCancelButton="true"
				title="提示">
				<view class="slot-content">
					<text style="font-weight: 500;font-size: 28rpx;color: #333333;">您还有未答完的题目，是否提前交卷</text>
				</view>
			</u-modal>
			<u-modal @cancel="modalShow2=false" @confirm="back()" :show="modalShow2" :showCancelButton="true"
				title="提示">
				<view class="slot-content">
					<text style="font-weight: 500;font-size: 28rpx;color: #333333;">当前考试尚未完成，确定退出吗?</text>
				</view>
			</u-modal>

			<!-- 提示框2 -->
			<u-modal confirmText="我知道了" @confirm="iKnow()" :show="modalShow3" :showCancelButton="false" title="提示">
				<view class="slot-content">
					<text style="font-weight: 500;font-size: 28rpx;color: #333333;">考试时间到,已自动提交试卷</text>
				</view>
			</u-modal>


			<!---flex布局flex布局结束-->
			<view class="flex benben-position-layout flex flex-wrap align-center coursePro_flex_3"
				:style=" {height:(150+bottomSafeAreaRpx)+'rpx',paddingBottom:bottomSafeAreaRpx+'rpx', }">

				<view class='coursePro_fd3_0' @tap.stop="startclassFunc()">
					<image @tap.stop="answerSheetShow = true" style="width: 40rpx;height: 40rpx;"
						src="/static/exam/ka.png" mode="">
					</image>答题卡
				</view>

				<text @tap.stop="goTop()" :style="{ opacity: examIndex == 0 ? 0.5 : 1 }" class="top">上一题</text>
				<text v-if="examIndex !== list.length-1" @tap.stop="goNext()" class="next">下一题</text>
				<text v-else @tap.stop="exitBtn()" class="next">完成</text>
			</view>
			<view :style="{height: (110+bottomSafeAreaRpx)+'rpx'}"></view>
		</view>
	</page-body>
</template>


<script>
	export default {
		data() {
			return {
				list: [],
				name: "",
				aid: "",
				answerSheetShow: false,
				modalShow: false,
				content: `空山新雨后<br>
									天气晚来秋`,
				testName: "",
				examIndex: 0, //当前正在做的题下标
				examObj: {}, // 当前正在做的题目
				value1: '',
				remainingSeconds: 0,
				timer: null,
				examTime: 0, //考试时间
				exampaper_id: "",
				modalShow2: false,//退出弹框
				modalShow3:false,//
				examlog_id: '',
				fileLists:[],//上穿的文件
				fwbbody:'',//简答题
				papercourse_id:'',//考试id
				xs_hand:'',// x分钟后可提交考试
				istj:false,//限制考试连点
			};
		},
		onLoad(options) {
			this.exampaper_id = options.exampaper_id
			this.testName = options.testName
			this.papercourse_id=options.papercourse_id
			this.xs_hand=options.xs_hand
			this.get_exam_list(options.exampaper_id)
			this.examTime = options.time
			
			this.startCountdown();
		},
		mounted() {

		},
		computed: {
			timeDisplay() {
				const h = String(Math.floor(this.remainingSeconds / 3600)).padStart(2, '0');
				const m = String(Math.floor((this.remainingSeconds % 3600) / 60)).padStart(2, '0');
				const s = String(this.remainingSeconds % 60).padStart(2, '0');
				return `${h}:${m}:${s}`;
			}
		},
		methods: {
			// 完成
			exitBtn() {
				if(this.list[this.examIndex].type=='6'){
					console.log(this.list[this.examIndex])
					// this.list[this.examIndex].answer=this.fileList
					this.list[this.examIndex].fileList=this.fileLists
					// this.list[this.examIndex].answer=this.fileLists
				}else if(this.list[this.examIndex].type=='4'){
					this.list[this.examIndex].answer = this.fwbbody
					this.examObj.answer = this.fwbbody
					this.list[this.examIndex].isanswer = true
					this.examObj.isanswer = true
				}else{
					this.list[this.examIndex].answer = this.examObj.answer
					
				}
				
				const index = this.list.findIndex((item) => !item.answer)
				console.log(index)
				if (index >= 0) {
					this.modalShow = true
				} else {
					this.submit()
				}
				console.log('vvvvvvvvvv', index);
			},
			startCountdown() {
				this.remainingSeconds = this.examTime * 60;

				if (this.timer) clearInterval(this.timer);

				this.timer = setInterval(() => {
					if (this.remainingSeconds > 0) {
						this.remainingSeconds--;
					} else {
						clearInterval(this.timer);
						this.timer = null;


						this.submit(2)
						this.modalShow3=true
						//考试时间到，强制交卷
						console.log('oooooooooooooooooooooooooooooo');
					}
				}, 1000);
			},
			back(){
				uni.navigateBack()
			},
			// 超时自动交卷 弹框提示关闭
			iKnow() {
				uni.$emit('tjks',1)
				setTimeout(() => {
					uni.navigateBack()
				}, 800)
				// uni.redirectTo({
				// 	url: "/pages/exam/examResult/examResult?examlog_id=" + this.examlog_id
				// })
			},
			getTypeName(type) {
				switch (Number(type)) {
					case 1:
						return '单选题';
					case 2:
						return '多选题';
					case 3:
						return '判断题';
					case 4:
						return '简答题';
					case 5:
						return '填空题';
					case 6:
						return '开放题';
					default:
						return '未知题型';
				}
			},
			selectChange(type, label) {
				if (type == 2) {
					// 多选题，answer 是数组
					if (!Array.isArray(this.examObj.answer)) {
						this.examObj.answer = [];
					}

					const index = this.examObj.answer.indexOf(label);
					if (index === -1) {
						this.examObj.answer.push(label);
					} else {
						this.examObj.answer.splice(index, 1);
					}
				} else {
					this.examObj.answer = label
				}
				console.log('vvvvvvvvvvvvvvvvv', type, label, this.examObj);
			},
			convertTo0123(input) {
				const map = {
					A: '0',
					B: '1',
					C: '2',
					D: '3',
					E: '4',
					F: '5'
				};

				if (Array.isArray(input)) {
					return input.map(v => map[v] ?? v);
				}

				if (typeof input === 'string') {
					return map[input] ?? input;
				}

				return input;
			},
			//val==2时间到 提交
			async submit(val) {
				const arr = this.list.map((item,index) => {
					const obj = {
						id: item.question_id,
						correct_option: item.answer
					};
					if ([1,2,3].includes(+item.type)) {
						console.log(item.answer)
						obj.correct_option = this.convertTo0123(item.answer)
						obj.correct_option=obj.correct_option?obj.correct_option:''
						
					}
					if ([2].includes(+item.type)) {
						if(obj.correct_option){
							obj.correct_option=obj.correct_option.map(Number)
							const arrs = obj.correct_option;
							const sortedArr = arrs.sort((a, b) => a - b);
							obj.correct_option=JSON.stringify(sortedArr)
						}else{
							obj.correct_option=''
							
						}
						
						
					}
					if([1].includes(+item.type)){
						obj.correct_option=obj.correct_option?"["+obj.correct_option+"]":''
					}
					if([5].includes(+item.type)){
						obj.correct_option=obj.correct_option?[String(obj.correct_option)]:''
					}
					if([6].includes(+item.type)){
						console.log(item)
						let arrr=''
						if(item.fileList.length>0){
							console.log(item.fileList)
							item.fileList.map(i=>{
								console.log(i.id)
								arrr+=i.id+','
							})
							arrr=arrr.substring(0, arrr.length - 1);
							console.log(arrr)
							// item.answer=arrr//只有地址链接
							item.answer=item.fileList//文档的所有数据
						}else{
							item.answer=''
						}
						obj.correct_option=this.list[index].answer
						console.log(item)
						console.log('开放题')
					}

					return obj;
				})

				this.modalShow = false
					console.log(arr)
					console.log(JSON.stringify(arr))
					let obj={
					papercourse_id:this.papercourse_id,
					exampaper_id: this.exampaper_id,
					answer_info: JSON.stringify(arr),
					dt_time: this.examTime * 60 - this.remainingSeconds
				}
				console.log( this.xs_hand * 60)
				
				let endtime= this.xs_hand * 60 - (this.examTime * 60 - this.remainingSeconds)
				console.log(obj)
				console.log(endtime)
				if(endtime > 0){
					this.$message.info('还有'+this.formatSeconds(endtime)+'才可以交卷')
					return
				}
				
					// return
					if(this.istj){
						return
					}
					this.istj=true
				let res = await this.$api.post(global.apiUrls.post684fc39fd59b6, {
					papercourse_id:this.papercourse_id,
					exampaper_id: this.exampaper_id,
					answer_info: JSON.stringify(arr),
					dt_time: this.examTime * 60 - this.remainingSeconds
				});

				if (res.data.code != 1) {
					this.istj=false
					this.$message.info(res.data.msg);
					return
				}
				this.examlog_id = res.data.data.examlog_id

				if (val == 2) return //时间到
				this.$message.info('提交成功')
				uni.$emit('tjks',1)
				setTimeout(() => {
					uni.navigateBack()
				}, 800)
				// uni.redirectTo({
				// 	url: "/pages/exam/examResult/examResult?examlog_id=" + this.examlog_id
				// })
			},
			 formatSeconds(seconds) {
			    // 处理负数和非数字情况
			    if (isNaN(seconds) || seconds < 0) {
			        return "0秒";
			    }
			    
			    seconds = Math.floor(seconds); // 取整
			    
			    const hours = Math.floor(seconds / 3600);
			    const minutes = Math.floor((seconds % 3600) / 60);
			    const remainingSeconds = seconds % 60;
			    
			    if (hours > 0) {
			        return `${hours}小时${minutes}分${remainingSeconds}秒`;
			    } else if (minutes > 0) {
			        return `${minutes}分${remainingSeconds}秒`;
			    } else {
			        return `${remainingSeconds}秒`;
			    }
			},
			//下一题
			goNext() {
				//点击下一题的时候，把当前题的答案给到list
				if(this.examObj.type==4){
					this.list[this.examIndex].answer = this.fwbbody
					this.examObj.answer = this.fwbbody
					this.list[this.examIndex].isanswer = true
					this.examObj.isanswer = true
				}else{
					this.list[this.examIndex].answer = this.examObj.answer
				}
				
				if(this.list[this.examIndex].type=='6'){
					this.list[this.examIndex].fileList=this.fileLists
					// this.list[this.examIndex].answer=this.fileLists
				}
				if (this.examIndex == this.list.length - 1 || this.list.length == 0) return
				
				this.examIndex++
				if(this.examObj.type==4){
					this.fwbbody=this.list[this.examIndex].answer
				}
				
				console.log(this.list)
				this.examObj = JSON.parse(JSON.stringify(this.list[this.examIndex]))
			},
			goTop() {
				//点击上一题的时候，把当前题的答案给到list
				if(this.examObj.type==4){
					this.list[this.examIndex].answer = this.fwbbody
					this.examObj.answer = this.fwbbody
					this.list[this.examIndex].isanswer = true
					this.examObj.isanswer = true
				}else{
					this.list[this.examIndex].answer = this.examObj.answer
				}
				
				if(this.list[this.examIndex].type=='6'){
					this.list[this.examIndex].fileList=this.fileLists
				}
				
				if (this.examIndex == 0) return
				this.examIndex--
				if(this.examObj.type==4){
					this.fwbbody=this.list[this.examIndex].answer
				}
				this.examObj = JSON.parse(JSON.stringify(this.list[this.examIndex]))
			},
			// 获取题目
			async get_exam_list(val) {
				let res = await this.$api.get(global.apiUrls.post684b92c80c9e7, {
					exampaper_id: val
				});
				console.log('llllllllllllll', res.data.data);


				if (res.data.code != 1) {
					this.$message.info(res.data.msg);
					return
				}


				this.list = res.data.data.list.map((item) => {
					item.type=item.type=='radio'?1:item.type=='selected'?2:item.type=='torf'?3:item.type=='cloze'?5:item.type=='open'?6:4
					if(item.type=='6'){
						item.fileList=[]
					}
					const obj = {
						...item,
						answer: ''
					};
					return obj;
				})
				this.examObj = JSON.parse(JSON.stringify(this.list[0]))
			}
		},
		beforeDestroy() {
			if (this.timer) clearInterval(this.timer);
		}
	};
</script>

<style lang="scss" scoped>
	.page {
		width: 100vw;
		overflow-x: hidden;
		min-height: calc(100vh - var(--window-bottom));
		background: #F8F8F8;
		background-size: 100% auto;
		background-color: #F3F4F8;

	}

	// 答题卡
	.answer-sheet {
		height: 919rpx;
		background: #FFFFFF;
		border-radius: 64rpx 64rpx 0rpx 0rpx;
		margin: 0 24rpx;

		.title {
			font-weight: 500;
			font-size: 32rpx;
			color: #000000;
			line-height: 117rpx;
			height: 117rpx;
			text-align: center;
			border-bottom: 2rpx solid #EEEEEE;
		}

		.answer-content {
			height: 790rpx;
			// background-color: #145EFD;
			overflow-y: auto;

			.type {
				font-weight: 400;
				font-size: 28rpx;
				color: #000000;
				line-height: 40rpx;
				margin-top: 32rpx;
			}

			.content {
				margin-top: 36rpx;
				display: flex;
				flex-wrap: wrap;

				.content-ite {
					width: 84rpx;
					height: 84rpx;
					background: rgba(201, 211, 227, 0.1);
					border: 1rpx solid #C9D3E3;
					border-radius: 84rpx;
					line-height: 84rpx;
					text-align: center;
					font-weight: 400;
					font-size: 32rpx;
					color: #333333;
					margin: 0 28rpx 36rpx;
				}

				.content-ite-other {
					background: rgba(20, 94, 253, 0.1);
					border: 1rpx solid #145EFD;
					color: #145EFD;
				}
			}
		}

	}

	// 简答
	.short-answer {
		margin-top: 24rpx;
		max-height: 720rpx; // 容器最大高度
		background: #F8F8FA;
		// border-radius: 16rpx;
		overflow-y: auto;

		.answer {
			font-weight: 400;
			font-size: 28rpx;
			color: #333333;
			line-height: 48rpx;
			min-height: 400rpx; // 设置最小高度，避免太小
			background-color: #F8F8FA;
		}
	}

	.overview {
		min-height: 500rpx;
		width: 100%;
		flex: 1;
		overflow-y: auto;
		overflow-y: auto;

		.time {
			height: 96rpx;
			background: #FFFFFF;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			margin: 24rpx;
			font-weight: 500;
			font-size: 36rpx;
			color: #333333;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.subject {
			// height: 1090rpx;
			padding: 32rpx 24rpx 40rpx;
			background: #FFFFFF;
			border-radius: 0rpx 0rpx 0rpx 0rpx;

			// 选项
			.changeBox {
				.change-item {
					margin-top: 36rpx;
					padding: 19rpx 23rpx;
					background: #F8F8FA;
					border-radius: 16rpx 16rpx 16rpx 16rpx;
					display: flex;
					align-items: center;
					border: 1rpx solid rgba(20, 94, 253, 0);

					.index {
						width: 48rpx;
						height: 48rpx;
						background: #EBEEF2;
						border-radius: 48rpx;
						font-size: 28rpx;
						color: #333;
						line-height: 48rpx;
						text-align: center;
						flex-shrink: 0;
						margin-right: 20rpx
					}
				}

				.change-item-active {
					background: #EEF6FE;
					border: 1rpx solid #145EFD;

					.index {
						background: #145EFD;
						color: #FFFFFF;
					}
				}
			}

			.title {
				font-weight: 400;
				font-size: 32rpx;
				color: #333333;
				line-height: 50rpx;
				margin-top: 44rpx;
			}

			.type {
				display: flex;
				align-items: center;
				justify-content: space-between;

				.name {
					display: flex;
					align-items: center;
					font-weight: 500;
					font-size: 32rpx;
					color: #333333;

					.line {
						width: 5rpx;
						height: 32rpx;
						background: #145EFD;
						border-radius: 4rpx 4rpx 4rpx 4rpx;
						margin-right: 12rpx;
					}
				}

				.number {
					font-size: 26rpx;
					color: rgba(153, 153, 153, 1);

					span {
						font-size: 32rpx;
						color: rgba(51, 51, 51, 1);
					}
				}
			}

		}
	}

	.coursePro_flex_3 {
		width: 750rpx;
		overflow: hidden;
		z-index: 10;
		bottom: calc(0rpx + var(--window-bottom));
		background-color: #fff;

		.coursePro_fd3_0 {
			font-weight: 400;
			font-size: 28rpx;
			color: #145EFD;
			border-radius: 44rpx;
			margin: 0 auto;
			display: flex;
			flex-direction: column;
			align-items: center;

		}

		.top {
			width: 257rpx;
			height: 84rpx;
			background: #FFFFFF;
			border-radius: 42rpx 42rpx 42rpx 42rpx;
			border: 1rpx solid #145EFD;
			line-height: 84rpx;
			text-align: center;
			font-weight: 500;
			font-size: 32rpx;
			color: #145EFD;
			margin-right: 24rpx;
		}

		.next {
			width: 257rpx;
			height: 84rpx;
			background: linear-gradient(270deg, #145EFD 0%, #6E9CFF 100%);
			border-radius: 42rpx 42rpx 42rpx 42rpx;
			line-height: 84rpx;
			text-align: center;
			font-weight: 500;
			font-size: 32rpx;
			color: #fff;
			margin-right: 24rpx;
		}
	}



	.mance_flex_0 {
		background: #fff;
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 10;
		top: 0rpx;
		background-size: 100% auto !important;
	}

	.mance_fd0_0_c1_c0 {
		font-size: 36rpx;
		font-weight: 700;
		color: #333333;
		line-height: 50rpx;
		max-width: 400rpx;
	}

	.mance_fd0_0_c0_c0 {
		font-size: 36rpx;
		color: #333;
	}

	.mance_fd0_0_c0 {
		width: 120rpx;
	}

	.mance_fd0_0 {
		padding: 0rpx 32rpx 0rpx 32rpx;
	}
	.cs_fd1_0_c3_c0_ibhf {
		line-height: 33rpx;
		.cs_fd1_0_c3_c0_c0_ibhf {
		    background: url(image-path('stcimg/5.png')) no-repeat;
		    background-size: 100% auto;
		    width: 702rpx;
		    height: 104rpx;
		    margin: 0rpx 0rpx 20rpx 0rpx;
		    color: rgba(27, 37, 64, 1);
		    font-size: 28rpx;
		
		    .cs_fd1_0_c3_c0_c0_c0_ibhf {
		        width: 48rpx;
		        height: 48rpx;
		        border-radius: 0rpx;
		        margin: 0rpx 24rpx 0rpx 52rpx;
		    }
		
		    .cs_fd1_0_c3_c0_c0_c2_ibhf {
		        width: 16rpx;
		        height: 16rpx;
		        border-radius: 0rpx;
		        margin: 0rpx 30rpx 0rpx auto;
		    }
		}
		.cs_fd1_0_c3_c0_c1_ibhf {
			width: 700rpx;
			padding: 24rpx 24rpx 0rpx 24rpx;
			
			.cs_flex_list_fd1_0_c3_c0_c1_ibhf {
				margin: 0rpx 0rpx 20rpx 0rpx;
			}
	
			.cs_flex_file_fd1_0_c3_c0_c1_ibhf {
				line-height: 60rpx;
			}
	
			.cs_flex_text_fd1_0_c3_c0_c1_ibhf {
				color: var(--benbenFontColor2);
			}
	
			.cs_flex_icon_fd1_0_c3_c0_c1_ibhf {
				z-index: 10;
				color: var(--benbenFontColor2);
				padding: 0rpx 0rpx 0rpx 15rpx;
			}
	
			.cs_fd1_0_c3_c0_c11_ibhf {
				// border-radius: 40rpx 40rpx 40rpx 40rpx;
				font-size: 32rpx;
				background: url(image-path('stcimg/7.png')) no-repeat;
				// background: var(--benbenbgColor2);
				background-size: 100% auto;
				color: rgba(40, 96, 244, 1);
				line-height: 104rpx;
				text-align: center;
			}
		}
	
		.cs_fd1_0_c3_c0_c2_ibhf {
			background: url(image-path('stcimg/7.png')) no-repeat;
			background-size: 100% auto;
			width: 702rpx;
			height: 104rpx;
			margin: 0rpx 0rpx 20rpx 0rpx;
			color: rgba(20, 94, 253, 1);
			font-size: 28rpx;
		}
	
		.cs_fd1_0_c3_c0_c1_c0_ibhf {
			color: rgba(211, 42, 41, 1);
			font-size: 28rpx;
		}
	
		.cs_fd1_0_c3_c0_c1_c1_ibhf {
			font-size: 24rpx;
			color: rgba(153, 153, 153, 1);
		}
	}
	.jdt{
				background-color: #ffffff;
				padding: 24rpx 0;
				border-radius: 16rpx;
				border: 1rpx solid #f5f5f5;
			}
			.ticketnotice_fd1_0_icch{
				padding: 0 32rpx;
				
			}
</style>